{% load static %}
{% load i18n %}
{% load btc_formats %}

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="description" content="{% block meta_description %}{% endblock meta_description %}">
    <meta name="author" content="">

    <link rel="icon" type="image/png" href="{% static "img/favicon-192x192.png" %}" sizes="192x192">
    <link rel="icon" type="image/png" href="{% static "img/favicon-160x160.png" %}" sizes="160x160">
    <link rel="icon" type="image/png" href="{% static "img/favicon-96x96.png" %}" sizes="96x96">
    <link rel="icon" type="image/png" href="{% static "img/favicon-16x16.png" %}" sizes="16x16">
    <link rel="icon" type="image/png" href="{% static "img/favicon-32x32.png" %}" sizes="32x32">

    <title>
      {% block title %}
        {% trans "Block Explorer for Bitcoin, Ethereum, Litecoin and More" %}
      {% endblock %}
      | BlockCypher
    </title>

    {# Webfonts #}
    <link href='//fonts.googleapis.com/css?family=Raleway:300' rel='stylesheet' type='text/css'>

    {# Bootstrap core CSS #}
    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">

    {# FontAwesome #}
    <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">

    {# Custom css #}
    <link href="{% static "css/custom.css" %}" rel="stylesheet">

    {% block extra_head %}{% endblock extra_head %}

  </head>

  <body>
    {#  Fixed navbar #}
    <div class="navbar navbar-default navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#nav-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>

          <a class="navbar-brand" href="http://www.blockcypher.com" title="live.blockcypher.com">
            <strong class="logo acc"></strong>
          </a>
        </div>

        <div class="collapse navbar-collapse" id="nav-collapse">

          <ul class="nav navbar-nav navbar-right">
            {% if not is_home %}
            <li>
              <form class="navbar-form navbar-search" role="search" method="post" action="{% url "home" %}">
                {% csrf_token %}
                <input type="hidden" value="{% firstof coin_symbol 'btc' %}" id="id_coin_symbol" name="coin_symbol">

                <div class="input-group">
                  <div class="input-group-btn">
                    <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                      <span id="search-dropdown-label">{% if coin_symbol %}{{ coin_symbol|coin_symbol_to_display_shortname }}{% else %}BTC{% endif %}</span> <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu" role="menu">
                      <li><a href="javascript:void(0);" onclick="setCoin('btc', 'BTC')">Bitcoin</a></li>
                      <li><a href="javascript:void(0);" onclick="setCoin('eth', 'ETH')">Ethereum</a></li>
                      <li><a href="javascript:void(0);" onclick="setCoin('ltc', 'LTC')">Litecoin</a></li>
                      <li><a href="javascript:void(0);" onclick="setCoin('doge', 'DOGE')">DogeCoin</a></li>
                      <li><a href="javascript:void(0);" onclick="setCoin('dash', 'DASH')">Dash</a></li>
                      <li><a href="javascript:void(0);" onclick="setCoin('bcy', 'BC Testnet')">BlockCypher Testnet</a></li>
                      <li><a href="javascript:void(0);" onclick="setCoin('btc-testnet', 'BTC Testnet')">Bitcoin Testnet</a></li>
                    </ul>
                  </div>
                  <input {% if not is_input_page %}autofocus="autofocus"{% endif %} name="search_string" id="id_search_string" type="text" class="form-control search-input" placeholder="Address, transaction or block">
                  <span class="input-group-btn">
                    <button type="submit" class="btn btn-primary" title="Search"><i class="fa fa-search"></i></button>
                  </span>
                </div>
              </form>
            </li>
            {% endif %}
            {% if coin_symbol %}
            <li class="hidden-sm">
              <a href="{% url 'coin_overview' coin_symbol %}" style="padding:7px 0 7px 15px;" title="{{ coin_symbol|coin_symbol_to_display_name }}">
               {% if coin_symbol == 'dash' %}<!-- This is done in order to works with previous css class "dash" already existing -->
                   <div class="header-coin dash-logo acc">{{ coin_symbol|coin_symbol_to_display_name }}</div>
               {% else %}
                   <div class="header-coin {{ coin_symbol }} acc">{{ coin_symbol|coin_symbol_to_display_name }}</div>
               {% endif %}
              </a>
            </li>
            {% endif %}
            <li class="dropdown hidden-sm">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
                {% if not coin_symbol %}
                  Blockchains
                {% endif %}
                <span class="caret"></span>
              </a>
              <ul class="dropdown-menu" role="menu">
                <li>
                  <a href="{% url 'coin_overview' 'btc' %}">Bitcoin</a>
                </li>
                <li>
                  <a href="{% url 'coin_overview' 'btc-testnet' %}">Bitcoin Testnet</a>
                </li>
                <li>
                  <a href="{% url 'coin_overview' 'eth' %}">Ethereum</a>
                </li>
                <li>
                  <a href="{% url 'coin_overview' 'ltc' %}">Litecoin</a>
                </li>
                <li>
                  <a href="{% url 'coin_overview' 'doge' %}">Dogecoin</a>
                </li>
                <li>
                  <a href="{% url 'coin_overview' 'dash' %}">Dash</a>
                </li>
                <li>
                  <a href="{% url 'coin_overview' 'bcy' %}">BlockCypher Testnet</a>
                </li>
              </ul>
            </li>
            {% if user.is_authenticated %}
            <li class="dropdown {# hidden-sm #}">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
                Account
                <span class="caret"></span>
              </a>
              <ul class="dropdown-menu" role="menu">
                <li>
                  <a href="{% url 'dashboard' %}">{% trans "Dashboard" %}</a>
                </li>
                <li>
                  <a href="{% url 'logout_request' %}">{% trans "Sign Out" %}</a>
                </li>
              </ul>
            </li>
            {% endif %}
            <li id="profile-menu" class="dropdown navbar-form">
              {% if tcp__ENABLE_TRANSLATIONS %}
                {% get_current_language as LANGUAGE_CODE %}
                {% get_language_info for LANGUAGE_CODE as lang %}
                <button class="dropdown-toggle btn-default btn" data-toggle="dropdown">
                  <strong>{{lang.name_local}}</strong> 
                  <b class="caret"></b>
                </button>
                <div class="dropdown-menu">
                  <form class="form-horizontal" action="{% url 'set_language' %}" method="post">
                    {% csrf_token %}
                    <input name="next" type="hidden" value="{{ redirect_to }}" />

                    <div class="switch-toggle well">
                    {% get_language_info_list for LANGUAGES as languages %}
                    {% for language in languages %}
                      <input id="{{ language.code }}" name="language" value="{{ language.code }}" type="radio" onclick="this.form.submit()"{% if language.code == LANGUAGE_CODE %} checked{% endif %}>
                      <label for="{{ language.code }}">
                        {{ language.name_local }}
                      </label>
                    {% endfor %}
                      <a class="btn btn-primary"></a>
                    </div>

                    <p>{% trans "Translations are currently in Beta."%}</p>
                  </form>
                  <div class="clearfix"></div>
                </div>
              {% endif %}
            </li>
          </ul>

        </div>
      </div>

    </div>

    {% if is_home %}
      <div class="main-container home">
        {# Including the messages for the homepage in the home template #}
    {% else %}
      <div class="main-container">
        {# Page Header Stuff #}
        <div class="page-header">
          <div class="container">
            {% block page_header %}
            {% endblock page_header %}
          </div>
        </div>
        {% include "partials/messages.html" %}
    {% endif %}

    {# page content here #}
    {% block content %}{% endblock content %}

    {% if coin_symbol == 'bcy' %}
      <div class="container">
        <p>
          Check out our
          <a href="https://www.blockcypher.com/dev/bitcoin/#testing{% if address %}?a={{ address }}{% endif %}">Blockcypher Faucet</a>
        </p>
      </div>
    {% endif %}

    {# end main-container #}
    </div>

    {# Footer #}

    <footer class="main-footer">
      <div class="container">
        <div class="row">

          <div class="col-sm-4">
            <p>We are social 
              <a href="https://twitter.com/blockcypher" class="social" target="_blank">
                <i class="fa fa-twitter"></i>
              </a> 
              <a href="https://www.facebook.com/blockcypher" class="social" target="_blank">
                <i class="fa fa-facebook"></i>
              </a> 
              <a href="https://github.com/blockcypher" class="social" target="_blank">
                <i class="fa fa-github-alt"></i>
              </a>
            </p>
          </div>

          <div class="col-sm-4 text-center">
          <p class="text-center reset">
            <a href="https://github.com/blockcypher/explorer" class="btn btn-default btn-lg btn-gh">
              <i class="fa fa-github"></i> 
              Fork me on GitHub
            </a>
          </p>
          </div>

          <div class="col-sm-4">
            <p class="text-right">
              Powered by <a href="http://www.blockcypher.com/">BlockCypher Web Services</a><br>
              © 2023 - BlockCypher
            </p>
          </div>

        </div>
      </div>
    </footer>

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
    <script src="{% static "js/custom.js" %}"></script>

    {% block extra_js %}{% endblock extra_js %}
    {% include "partials/ga.html" %}
  </body>
</html>
